<template>
    <div class="bind-camera">
        <search-table
            :columns="columns"
            :data="list"
            :total="total"
            :page.sync="search.pageIndex"
            :size.sync="search.pageSize"
            @queryFun="getDefenseFiles">
            <template slot="select-group">
                <Select filterable
                    v-model="search.teamId"
                    placeholder="请选择团队"
                    filterable
                    clearable
                    @on-change="getDefenseFiles(1)">
                    <Option  v-for="item in teamList" :value="item.id"  :key="item.id" :title="item.name">{{item.name}}</Option>
                </Select>
                <Select filterable 
                    v-model="search.targetName"
                    @on-change="getDefenseFiles(1)" 
                    clearable
                    filterable
                    placeholder="请选择题目">
                    <Option v-for="item in questionList" :value="item.name" :key="item.id" :title="item.name">{{ item.name }}</Option>
                </Select>
                <Select filterable v-model="search.isRight" @on-change="getDefenseFiles(1)" placeholder="请选择验证结果" filterable clearable>
                    <Option  value="1">正确</Option>
                    <Option  value="0">错误</Option>
                    <Option  value="3">待验证</Option>
                </Select>
            </template>
            <template slot="input-group">
                <Input v-model="search.fileName" placeholder="防御补丁名称" @on-change="getDefenseFiles(1)" clearable/>
            </template>
        </search-table>
    </div>
</template>

<script>
    import SearchTable from '@/components/SearchTable/SearchTable'
    import { getDefenseFiles } from '@/api/drill'
    import { getTargetTeamList_new } from '@/api/drill_compete' 
    import teamMixin from '@/mixin/groupMixin'

    export default {
        name: 'DefensePatch',
        components: {
            SearchTable
        },
        mixins: [
            teamMixin
        ],
        props: {
            scoringType:{
                type:Number,
                default:0
            }
        },
        data() {
            return {
                total: 0, // 总数据量
                questionList: [],
                columns: [
                    {
                        title:'团队名称',
                        key:'teamName',
                        align:'center',
                        tooltip:true,
                        placement:'top-left',
                        width: 200
                    },
                    {
                        title:'用户',
                        key:'userName',
                        width:100,
                        tooltip:true,
                    },
                    {
                        title:'靶标',
                        key:'targetName',
                        align:'center',
                        width:150,
                        tooltip:true,
                    },
                    {
                        type:'link',
                        title:'补丁名称',
                        key:'fileName',
                        width:200,
                        setPath:(data) => {
                            return '/api/minio/download/'+data.fileId
                        },
                        // render:(h,params)=>{
                        //     return h('Tooltip',{
                        //         props:{
                        //             content:params.row.fileName,
                        //             transfer:true,
                        //             'max-width':200
                        //         },
                        //     },[
                        //         h('a',{
                        //             attrs:{
                        //                 href:'/api/minio/download/'+params.row.fileId
                        //             },
                        //             style:{
                        //                 'word-break': 'keep-all',
                        //                 'white-space': 'nowrap',
                        //                 overflow: 'hidden',
                        //                 'text-overflow': 'ellipsis',
                        //                 width:'200px'
                        //             }
                        //         },params.row.fileName)
                        //     ])
                        // }
                    },
                    {
                        title:'得分',
                        key:'score',
                        align:'center',
                        width:50,
                        tooltip:true,
                        render:(h,params)=>{
                            return h('span',{
                                style:{
                                    color:params.row.score > 0 ? '#f5222d' : '',
                                    fontWeight:params.row.score > 0 ? 'bold' : ''
                                }
                            },params.row.score)
                        },
                        show:() => {
                            this.scoringType === 0
                        }
                    },
                    {
                        title:'导入状态',
                        key:'importState',
                        align:'center',
                        minWidth:140,
                        placement:'top-right',
                        render:(h,params)=>{
                            return h('Tag',{
                            props:{
                                color: params.row.importState === 0 ? 'blue' : (params.row.importState === 1 ? 'green' : 'red')
                            }
                            }, params.row.importState === 0 ? '导入中' : (params.row.importState === 1 ? '导入成功' : '导入失败'))
                        }
                    },
                    {
                        title:'验证结果',
                        key:'isRight',
                        align:'center',
                        width:140,
                        placement:'top-right',
                        render:(h,params)=>{
                            return h('Tag',{
                                props:{
                                    color: params.row.isRight === 0 ? 'red' : (params.row.isRight === 1 ? 'green' : 'blue')
                                }
                            }, params.row.isRight === 0 ? '错误' : (params.row.isRight === 1 ? '正确' : '待验证'))
                        }
                    },
                    {
                        title:'验证错误信息',
                        key:'errMsg',
                        align:'center',
                        width:140,
                        tooltip:true
                        // render:(h,params) => {
                        //     let errMsg = params.row.errMsg  || '-'
                        //     if (errMsg !== '-') {
                        //     return h('Tooltip',{
                        //         props:{
                        //         content: errMsg,
                        //         transfer:true,
                        //         'max-width':'300',
                        //         },
                        //         style: {
                        //         width: '100%',
                        //         }
                        //     }, [
                        //         h('span', {
                        //         style: {
                        //             width: '100%',
                        //             'white-space': 'nowrap',
                        //             overflow: 'hidden',
                        //             'text-overflow': 'ellipsis'
                        //         }
                        //         }, errMsg)
                        //     ])
                        //     } else {
                        //     return h('span', errMsg)
                        //     }
                        // }
                    },
                    {
                        title:'上传时间',
                        key:'createTime',
                        width:180,
                    },
                    {
                        title:'验证时间',
                        key:'verifyTime',
                        width:180,
                    },
                    {
                        title:'验证周期',
                        key:'number',
                        align:'center',
                        ellipsis:true,
                        width:130,
                        render:(h,params) => {
                            let number = params.row.verifyInfo && params.row.verifyInfo.number
                            return h('span',number ? `第${number}周期` : '-')
                        }
                    },
                    {
                        title:'周期开始时间',
                        key:'startTime',
                        align:'center',
                        ellipsis:true,
                        tooltip:true,
                        minWidth:180,
                        render:(h,params)=>{
                            let startTime = params.row.verifyInfo && params.row.verifyInfo.startTime
                            return h('span', startTime||'-')
                        }
                    },
                    {
                        title:'周期结束时间',
                        key:'nextStartTime',
                        align:'center',
                        ellipsis:true,
                        tooltip:true,
                        minWidth:180,
                        render:(h,params)=>{
                            let nextStartTime = params.row.verifyInfo && params.row.verifyInfo.nextStartTime
                            return h('span', nextStartTime||'-')
                        }
                    }
                ],
                search: { // 搜索条件
                    targetName: '', // 靶标名称
                    teamId: '', // 团队ID
                    isRight: '', // 是否正确
                    pageSize: 10, // 分页大小
                    pageIndex: 1, // 当前页
                    fileName: '', // 防御补丁名称
                },
                list: []
            }
        },
        mounted() {
            this.$nextTick(() => {
                this.getDefenseFiles()
                this.getQuestions()
            })
        },
        methods: {
            getQuestions() {
                getTargetTeamList_new({
                    pageIndex:1,
                    pageSize:2147483647,
                    sceneId:this.$route.query.id,
                    projectId:this.$route.query.prjid
                }).then(data => {
                    if(data.code==1){
                        this.questionList = data.data.items || data.data;
                    }
                })
            },
            // 查询机器重置记录
            getDefenseFiles(pageNow) {
                this.search.pageIndex = pageNow || this.search.pageIndex
                getDefenseFiles({
                    teamId: this.search.teamId,
                    pageIndex: this.search.pageIndex,
                    pageSize: this.search.pageSize,
                    fileName: this.search.fileName,
                    targetName: this.search.targetName,
                    isRight: this.search.isRight,
                    sceneId: this.$route.query.id
                }).then(({ code, message, data = {} }) => {
                    if (code !== 1) {
                        this.$Message.warning(message)
                        return
                    }
                    this.total = data.total
                    this.list = data.items
                }).catch(() => {
                    this.$Message.error('获取防御补丁列表异常')
                })
            },
        }
    }
</script>

<style scoped>
</style>